﻿<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<!--suppress HtmlRequiredTitleElement -->
<head>
    <th:block th:include="include :: header('用户管理')"/>
    <link rel="stylesheet" href="/static/assets/system/css/deptUser.css"/>
</head>
<body class="layui-layout-body theme-himio">
<!-- 正文开始 -->
<div class="layui-fluid" style="padding-bottom: 0;">
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md2">
            <div class="layui-card">
                <div class="layui-card-body" style="padding: 10px;">
                    <!-- 树工具栏 -->
                    <div class="layui-form toolbar" id="deptTreeBar">
                        <button id="deptAddBtn" class="layui-btn layui-btn-normal layui-btn-sm icon-btn"
                                shiro:hasPermission="system:dept:add">
                            <i class="layui-icon layui-icon-add-1"></i>
                        </button>&nbsp;
                        <button id="deptEditBtn" class="layui-btn layui-btn-primary layui-btn-sm icon-btn"
                                shiro:hasPermission="system:config:edit">
                            <i class="layui-icon layui-icon-edit"></i>
                        </button>&nbsp;
                        <button id="deptDelBtn"
                                class="layui-btn layui-btn-sm layui-bg-cyan icon-btn"
                                shiro:hasPermission="system:config:remove">
                            <i class="layui-icon layui-icon-delete"></i>
                        </button>
                    </div>
                    <div class="layui-container tree-tips">
                        <br>
                        <blockquote class="layui-elem-quote">划横线的代表【<s style="color: #ccc;">停用</s>】</blockquote>
                    </div>
                    <!-- 左树 -->
                    <div id="deptTree"></div>
                </div>
            </div>
        </div>
        <div class="layui-col-md10">
            <div class="layui-card">
                <div class="layui-card-body" style="padding: 10px;">
                    <form class="layui-form toolbar" id="deptUserTbSearchForm">
                        <div class="layui-form-item">
                            <div class="layui-inline">
                                <label class="layui-form-label">登录名称:</label>
                                <div class="layui-input-inline" style="width: 130px;">
                                    <label>
                                        <input type="text" name="loginName" autocomplete="off" class="layui-input">
                                    </label>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">手机号码:</label>
                                <div class="layui-input-inline" style="width: 130px;">
                                    <label>
                                        <input type="text" name="phoneNumber" autocomplete="off" class="layui-input">
                                    </label>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">用户状态:</label>
                                <div class="layui-input-inline" style="width: 130px;">
                                    <label>
                                        <select name="status">
                                            <option value="">请选择</option>
                                            <option value="0">正常</option>
                                            <option value="2">停用</option>
                                        </select>
                                    </label>
                                </div>
                            </div>
                            <div class="layui-inline">
                                <label class="layui-form-label">创建时间:</label>
                                <div class="layui-input-inline">
                                    <input type="text" name="gmtCreate" class="layui-input" id="gmtCreate"
                                           placeholder="开始 到 结束">
                                </div>
                            </div>
                            <div class="layui-inline">
                                <button class="layui-btn icon-btn" lay-filter="deptUserTbSearch" lay-submit
                                        style="margin-top: -6px;">
                                    <i class="fa fa-search"></i>搜索
                                </button>
                                <button type="reset" class="layui-btn layui-btn-primary icon-btn"
                                        style="margin-top: -6px;"><i class="fa fa-refresh"></i>重置
                                </button>
                            </div>
                        </div>
                    </form>
                    <!-- 数据表格 -->
                    <table id="deptUserTable" lay-filter="deptUserTable"></table>
                </div>
            </div>
        </div>
    </div>
</div>

<!-- 表单部门弹窗 -->
<script type="text/html" id="deptEditDialog">
    <form id="deptEditForm" lay-filter="deptEditForm" class="layui-form model-form"
          style="padding-right: 50px;">
        <input name="deptId" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">上级部门:</label>
            <div class="layui-input-block">
                <div id="deptEditParentSel" class="ew-xmselect-tree"></div>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">部门名称:</label>
            <div class="layui-input-block">
                <input name="deptName" placeholder="请输入机构名称" class="layui-input"
                       lay-verType="tips" lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">显示排序:</label>
            <div class="layui-input-block">
                <input name="orderNum" placeholder="请输入显示排序" class="layui-input" type="number" style="width: 150px;"
                       lay-verType="tips" lay-verify="required" required/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">负责人:</label>
            <div class="layui-input-block">
                <input name="leader" placeholder="请输入负责人" class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">联系电话:</label>
            <div class="layui-input-block">
                <input name="phone" placeholder="请输入联系电话" class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">邮箱:</label>
            <div class="layui-input-block">
                <input name="email" placeholder="请输入邮箱" class="layui-input" type="email"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">部门状态:</label>
            <div class="layui-input-block">
                <input type="radio" th:each="dict : ${@dict.getType('sys_normal_disable')}" th:id="${dict.dictCode}"
                       name="status" th:value="${dict.dictValue}" th:checked="${dict.default}"
                       th:title="${dict.dictLabel}"
                       lay-verType="tips" lay-verify="required" required/>

            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn layui-bg-blue" lay-filter="deptEditSubmit" lay-submit>保存</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>
<!-- 表格操作列 -->
<script type="text/html" id="deptUserTbBar">
    <a class="layui-btn layui-bg-blue layui-btn-sm icon-btn" lay-event="edit" shiro:hasPermission="system:user:edit"><i
            class="fa fa-edit"></i>编辑</a>
    <!--    <a class="layui-btn layui-btn-danger layui-btn-sm icon-btn" lay-event="del"><i class="fa fa-trash"></i>删除</a>-->
    <a class="layui-btn layui-bg-cyan layui-btn-sm icon-btn" lay-event="more" id="deptUserMore"
       shiro:hasPermission="system:user:edit"><i
            class="fa fa-angle-right"></i>更多操作</a>
</script>
<!-- 表格工具列 -->
<script type="text/html" id="deptUserTbToolBar">
    <button lay-event="add" class="layui-btn layui-btn-sm icon-btn" style="margin-bottom: 15px;"
            shiro:hasPermission="system:user:add">
        <i class="layui-icon">&#xe654;</i>添加
    </button>&nbsp;
    <button lay-event="del" class="layui-btn layui-btn-sm layui-btn-danger icon-btn" style="margin-bottom: 15px;"
            shiro:hasPermission="system:user:remove">
        <i class="layui-icon">&#xe640;</i>删除
    </button>&nbsp;
    <button lay-event="import" class="layui-btn layui-btn-sm layui-bg-green icon-btn" style="margin-bottom: 15px;"
            shiro:hasPermission="system:user:import">
        <i class="layui-icon layui-icon-upload-drag"></i>导入
    </button>&nbsp;
    <button lay-event="export" class="layui-btn layui-btn-sm layui-bg-cyan icon-btn" shiro:hasPermission="system:user:export" style="margin-bottom: 15px;">
        <i class="layui-icon layui-icon-export"></i>导出
    </button>
</script>
<!-- 用户状态 -->
<script type="text/html" id="userStatusTpl">
    <input type="checkbox" name="status" value="{{d.userId}}" lay-skin="switch" lay-text="正常|锁定"
           lay-filter="userStatusFilter" {{ d.status=== '0' ? 'checked' : '' }}>
</script>
<!-- 表单用户弹窗 -->
<script type="text/html" id="deptUserEditDialog">
    <form id="deptUserEditForm" lay-filter="deptUserEditForm" class="layui-form model-form">
        <input name="userId" type="hidden"/>
        <div class="layui-row">
            <h5 class="layui-form-item-title">主要信息</h5>
            <div class="layui-col-md6">
                <div class="layui-form-item" id="loginNameDiv">
                    <label class="layui-form-label layui-form-required">登录账号:</label>
                    <div class="layui-input-block">
                        <label>
                            <input name="loginName" placeholder="请输入账号" class="layui-input"
                                   lay-verType="tips" lay-verify="required" required/>
                        </label>
                    </div>
                </div>

                <div class="layui-form-item" id="initPass">
                    <label class="layui-form-label layui-form-required">初始密码 <i class="fa fa-info-circle" th:lay-tips="${'初始密码：'+@config.getKey('sys.user.initPassword')+'<br/>在参数配置中可以修改'}"></i>:
                    </label>
                    <div class="layui-input-block">
                        <label>
                            <input name="password" type="password" placeholder="请输入密码" class="layui-input"
                                   th:value="${@config.getKey('sys.user.initPassword')}"
                                   lay-verType="tips" lay-verify="required" required/>
                        </label>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">角色:</label>
                    <div class="layui-input-block">
                        <div id="userEditRoleSel"></div>
                    </div>
                </div>

            </div>
            <div class="layui-col-md6">

                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">用户名称:</label>
                    <div class="layui-input-block">
                        <input name="userName" placeholder="请输入用户名称" class="layui-input"
                               lay-verType="tips" lay-verify="required" required/>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">用户状态:</label>
                    <div class="layui-input-block">
                        <input type="radio" name="status" value="0" title="正常" checked/>
                        <input type="radio" name="status" value="1" title="停用"/>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label layui-form-required">性别:</label>
                    <div class="layui-input-block">
                        <input type="radio" name="sex" value="0" title="男"/>
                        <input type="radio" name="sex" value="1" title="女"/>
                        <input type="radio" name="sex" value="2" title="未知" checked/>
                    </div>
                </div>

            </div>
        </div>
        <div class="layui-row">
            <h5 class="layui-form-item-title">额外信息</h5>
            <div class="layui-col-md6">

                <div class="layui-form-item">
                    <label class="layui-form-label">部门:</label>
                    <div class="layui-input-block">
                        <div id="deptUserEditParentSel" class="xm-select-demo"></div>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">手机号:</label>
                    <div class="layui-input-block">
                        <label>
                            <input name="phoneNumber" type="tel" placeholder="请输入手机号" class="layui-input"/>
                        </label>
                    </div>
                </div>

            </div>
            <div class="layui-col-md6">


                <div class="layui-form-item">
                    <label class="layui-form-label">岗位:</label>
                    <div class="layui-input-block">
                        <div id="userEditPostSel"></div>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">邮箱:</label>
                    <div class="layui-input-block">
                        <label>
                            <input name="email" type="email" placeholder="请输入邮箱" class="layui-input"/>
                        </label>
                    </div>
                </div>
            </div>
            <div class="layui-row">

                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">备注</label>
                    <div class="layui-input-block">
                        <label>
                            <textarea name="remark" placeholder="请输入内容" class="layui-textarea"></textarea>
                        </label>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn" lay-filter="deptUserEditSubmit" lay-submit>保存</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>
<!-- 重置密码弹窗 -->
<script type="text/html" id="resetPwdDialog">
    <form id="resetPwdEditForm" lay-filter="resetPwdEditForm" class="layui-form model-form">
        <input name="userId" type="hidden"/>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">登录账号:</label>
            <div class="layui-input-block">
                <label>
                    <input name="loginName" class="layui-input" readonly="readonly" disabled="disabled"/>
                </label>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">账号名称:</label>
            <div class="layui-input-block">
                <label>
                    <input name="userName" class="layui-input" readonly="readonly" disabled="disabled"/>
                </label>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label layui-form-required">密码:</label>
            <div class="layui-input-block">
                <label>
                    <input name="password" placeholder="请输入密码" class="layui-input" type="password" th:value="${@config.getKey('sys.user.initPassword')}"
                           lay-verType="tips" lay-verify="required" required/>
                </label>
            </div>
        </div>
        <div class="layui-form-item text-right">
            <button class="layui-btn" lay-filter="resetPwdEditSubmit" lay-submit>确定</button>
            <button class="layui-btn layui-btn-primary" type="button" ew-event="closeDialog">取消</button>
        </div>
    </form>
</script>
<!-- 导入弹窗 -->
<script type="text/html" id="importUserDialog">
    <form enctype="multipart/form-data">
        <div class="layui-col-xs-offset1">
            <input type="file" id="file" name="file"/>
            <div style="margin-top: 10px;padding-top: 5px;">
                <input type="checkbox" id="updateSupport" name="updateSupport" title="如果登录账户已经存在，更新这条数据。"> 是否更新已经存在的用户数据
                &nbsp; <a onclick="downloadTemplate()" class="btn btn-default btn-xs" style="cursor:pointer;"><i
                    class="fa fa-file-excel-o"></i> 下载模板</a>
            </div>
            <span class="pull-left" style="margin-top: 10px;color: red;">
                提示：仅允许导入“xls”或“xlsx”格式文件！
            </span>
        </div>
    </form>
</script>

<!-- js部分 -->
<th:block th:include="include :: footer"/>
<script th:inline="javascript">
    var userAddFlag = [[${@permission.hasPermit('system:user:add')}]];
    var deptAddFlag = [[${@permission.hasPermit('system:dept:add')}]];
    var userEditFlag = [[${@permission.hasPermit('system:user:edit')}]];
    var deptEditFlag = [[${@permission.hasPermit('system:dept:edit')}]];
    var userRemoveFlag = [[${@permission.hasPermit('system:user:remove')}]];
    var deptRemoveFlag = [[${@permission.hasPermit('system:dept:remove')}]];
    var userExportFlag = [[${@permission.hasPermit('system:user:export')}]];

    var dictSysYesNo = [[${@dict.getType('sys_yes_no')}]];
    var dictSysUserSex = [[${@dict.getType('sys_user_sex')}]];

    var allRoles = [[${roles}]];
    var allPost = [[${posts}]];

    var prefixUser = ctx + "system/user";
    var prefixDept = ctx + "system/dept";
</script>
<script th:src="@{/static/assets/system/js/deptUser.js}"></script>
</body>
</html>